<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/jsp/taglibs.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<base href="<%=basePath%>" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=7" />
		<title>report right</title>
		<link id="editCss" rel="stylesheet" type="text/css"
			href="<%=basePath%>css/right.css" />
		<link id="editCss" rel="stylesheet" type="text/css"
			href="<%=basePath%>css/style.css" />

		<script type="text/javascript" src="<%=basePath%>js/base.js"></script>
		<script type="text/javascript" src="<%=basePath%>js/popUpBase.js"></script>
		<script type="text/javascript"
			src="<%=basePath%>js/permission_dtree.js"></script>
			
		<!-- dwr -->
		 <script type='text/javascript' src='<%=basePath%>dwr/interface/permission.js'></script>
 		 <script type='text/javascript' src='<%=basePath%>dwr/engine.js'></script>
			
	</head>
	<body class="role">
		<form method="post">
			<div class="crumbs"> 
				当前位置：首页 &gt; 角色分配权限 
			</div>
			<%--div class="search">
				<div class="tab">
		<span class="right"></span>
		<span class="font-blue14pxb">角色分配权限</span>
				</div>
			</div> --%>
			<div class="popUpCon" style="height: 365px; width: 100%;background:none">
				<div class="list" style="height: 365px; width:65%;" >
					<div class="tableBox" style="margin: 1px">
						<input type="hidden" name="hiddenId" id="hiddenId" />
						<table cellPadding="0" cellSpacing="0" border="0" width="100%"
							id="tableList"
							style="border-collapse: collapse; empty-cells: show;background-color:#FFF;">
							<tr>
								<th>
									序号
								</th>
								<th>
									角色ID
								</th>
								<th>
									角色名称
								</th>
								<th>
									角色描述
								</th>
								<th>
									操作
								</th>
							</tr>
							<c:forEach items="${roleList}" var="role" varStatus="index">
								<tr>
									<td>${index.count }
									</td>
									<td>${role["ROLE_ID"]}</td>
									<td>${role["ROLE_NAME"]}</td>
									<td>${role["DESCRIPTION"]}</td>
									<td><input type="button" class="button" name="addPermission"
										value="分配权限" accept='${role["ROLE_ID"]}'  />
									</td>
								</tr>
							</c:forEach>
						</table>
					</div>
				</div>
				<div  class="list" style="width:31%; height: 365px;">
					<div id="treeId" style="width:98%; height: 320px;overflow: auto;margin-top: 2px;margin-bottom: 2px;margin-left: 2px;">
						<script type="text/javascript">
							var table = document.getElementById("tableList") ;
							var cell = table.rows[1].cells[1] ;
							document.getElementById("hiddenId").value = cell.innerHTML ;
							
							var d = new dTree('d',true);
							d.add("0", -1, "角色ID:  <b><span style=\"color:red\">"+cell.innerHTML+"</span></b> 的权限结构树");
						</script>
						<c:forEach items="${treeList}" var="tree">
							<script type="text/javascript">
								d.add('${tree["ID"]}', '${tree["PID"]}', '${tree["NAME"]}','${tree["URL"]}');
							</script>
						</c:forEach>
						<script type="text/javascript">
							document.write(d);
						</script>
					</div>
					<div class="popUpFooter">
						<input type="button" class="button" value=" 保存 " onclick="doSave()"/>
					</div>
				</div>
			</div>
		</form>
	</body>
	<script type="text/javascript">
			document.getElementById("0").getElementsByTagName("input")[0].checked = d.getFirstChecked() ;
	</script>
	<script type="text/javascript">
		
		//绑定checkbox 点击事件
		function clickCheckBox(){
			var tree = document.getElementById("treeId");
			var checks = tree.getElementsByTagName("input") ;
			for(var i=0;i<checks.length;i++){
				if(checks[i].type=="checkbox"){
					checks[i].onclick = function(){
						clickCheckbox(this);
					}
				}
			}	
		}
		clickCheckBox();
		
		function clickCheckbox(o){
			//alert(d.toString());
			var cName = o.parentNode.parentNode.className ;
			//获取前一兄弟节点 
			//var brother = o.previousSibling ;
			if(cName=="dtree"){
				var tree = document.getElementById("treeId");
				var inputs = tree.getElementsByTagName("input") ;	
				for(var i=0;i<inputs.length ;i++){
					if(inputs[i].type == "checkbox"){
						inputs[i].checked = o.checked ;
					}
				}
			}else{
				adjustParent(o);
				adjustChild(o);
			}
		}
		
		function adjustParent(o){
			var pId = o.nextSibling.value ;
			//获取前一兄弟节点 
			//var brother = o.previousSibling ;
			
			var parent = document.getElementById(pId); ;
			
			if(parent==null){
				return ;
			}
			if(parent.nodeName!='DIV'){
				return ;
			}
			if(parent.id=="treeId"){
				return ;				
			}

			var children = parent.childNodes;
			var type ;
			//上一级checkbox 
			var cCheckbox = null ;
			//var ppId = null ;
			for(var j=0;j<children.length;j++){
				if(children[j].nodeType!=3){
					type = children[j].type ;
					if(type!="undefined" && type!=null &&type.trim()=="checkbox"){
						children[j].checked = !children[j].checked ;
						cCheckbox = children[j] ;
						//ppId = cCheckbox.nextSilbing.value ;
					}
				}
			}
			
			var checks = document.getElementsByTagName("input");
			//同级hidden 
			var sHidden	= null ;
			for(var i=0;i<checks.length;i++){
				sHidden = checks[i];
				if(sHidden.type=="hidden" && pId==sHidden.value ){
					if( sHidden.previousSibling !=null && sHidden.previousSibling.checked){
						cCheckbox.checked = true ;
					}
				}
			}
			adjustParent(cCheckbox);
		}
		
		function adjustChild(o){
			var mId = o.parentNode.id ;
			var sign = true ;
			var checks = document.getElementsByTagName("input");
			for(var i=0;i<checks.length;i++){
				sHidden = checks[i];
				if(sHidden.type=="hidden" && mId==sHidden.value ){
					sign = false ;
					if( sHidden.previousSibling !=null ){
						sHidden.previousSibling.checked = o.checked ;
						adjustChild(sHidden.previousSibling);
					}
				}
				
				if(!sign){
					continue ;
				}
			}
		}
		
	</script>
	<script type="text/javascript">
		function doSave(){
			var roleId = document.getElementById("hiddenId").value ;
		//	var tree = document.getElementById("treeId");
			var checks = document.getElementsByName("permissionList") ;
			roleId = roleId.replace(/\r/ig,"").replace(/\n/ig,""); 
			var permissionList = "" ;
			for(var i=0;i<checks.length;i++){
				if(checks[i].checked && checks[i].value!=0){
					permissionList +=checks[i].value+"," ;
				}
			} 
			
			if(permissionList.length > 0){
				//删除 逗号
				permissionList = permissionList.slice(0,permissionList.length-1);
			}
			
			permission.saveRole_Permission(roleId,permissionList,function(result){
				alert(result=="true"?"保存成功":"保存失败");
			});
		}
	</script>
	<script type="text/javascript">
		
		var dd = null ;
		(function(){
			var buttons = document.getElementsByName("addPermission");
			var roleId = '-1' ;
			
			for(var i=0;i<buttons.length;i++){
				buttons[i].onclick = function(){
					roleId = this.accept ;
					document.getElementById("hiddenId").value = roleId ;
					permission.getTreeByRoleId(roleId,function(result){
						var newResult = result.replace(/\r/ig,"").replace(/\n/ig,""); 
						var json_r = eval(newResult);
						if(json_r != null && json_r.length>0){
							delete d ; 
							var div = document.getElementById("treeId");
							dd = new dTree('dd',true);
							dd.add("0",-1,"角色ID: <b><span style=\"color:red\">"+roleId+"<span></b> 的权限结构树");
							for(var i=0;i<json_r.length;i++){
								dd.add(json_r[i].id,json_r[i].pid,json_r[i].name,json_r[i].url);
							}
							div.innerHTML = dd.toString();
							//注册checkbox事件 
							clickCheckBox();
							//是否勾选根 checkbox 
							document.getElementById("0").getElementsByTagName("input")[0].checked = dd.getFirstChecked() ;
						}
					});
				}
			}
		})()
	</script>
</html>